<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" 	uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" 	%>
<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" 	%> 

<jsp:include page="./dbChatConfig.jsp" flush="false" />

<sql:query var="dualTable" dataSource="${oracleDs}" >
	select SYSDATE from dual
</sql:query>

<sql:query var="chatRoomList" scope="request" 
	dataSource="${oracleDs}" 
	startRow="0" maxRows="100"
>
	/* 채팅방 목록 조회 */
	SELECT 
		ROWNUM AS chat_room_no ,
		chat_room_id , 
		chat_room_name ,
		chat_room_valid ,
		NVL( chat_room_name, '방제 없음' ) AS chat_room_disp_name ,
		chat_room_user_name,
  		TO_CHAR( chat_room_cre_date,'YYYY-MM-DD HH24:MI:SS') AS chat_room_cre_date ,
  		1 as a
	FROM chat_room
	WHERE 1 = 1 
	AND chat_room_id = ?
	<sql:param value= "${ param.chatRoomId }" />
	/* 끝. 채팅방 목록 조회 */
</sql:query> 

<c:set var="chatRoomValid"  	value="${ -1 }" 	/>
<c:set var="chatRoomId" 		value="-1"  		/>

<c:forEach items="${ chatRoomList.rows }" var="row" varStatus="status" >
	<c:set var="chatRoomId" 		value="${ row.chat_room_id	 		}"  />
	<c:set var="chatRoomName" 		value="${ row.chat_room_name 		}"  />
	<c:set var="chatRoomDispName" 	value="${ row.chat_room_disp_name	}"  />
	<c:set var="chatRoomValid"  	value="${ row.chat_room_valid 		}" 	/>
	<c:set var="chatRoomUserName"	value="${ row.chat_room_user_name 	}" 	/>
	<c:set var="chatRoomCreDate"	value="${ row.chat_room_cre_date 	}" 	/>
</c:forEach>

<c:set var="chatDisabled" value="${ chatRoomValid > 0 ? '' : 'disabled' }" /> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title> DB 채팅 </title>
<style>
	body {
		border-top: 1px solid black;
		border-bottom: 1px solid black;
	}
</style>

<script>
	function checkSendMsg() {
		// 사용자 아이디와 전송 메시지 미 입력시 메시지를 팝업한다.
		var userName = document.getElementById( "userName" );
		if( userName.value == '' ) {
			alert( "채팅방 아이디를 입력하세요." );
			userName.focus();
			return false;
		}
		
		var msgText = document.getElementById( "msgText" );
		
		if( msgText.value == '' ) {
			alert( "메시지를 입력하세요." );
			msgText.focus();
			return false;
		}
		
		if( false ) {  
			var f = document.getElementById( "msgText" );
			f.value = "";
		}
		
		return true;
	}
</script>
	
</head>
<body>
	<h3>
		<a href="../index.html" > 첫 페이지 	</a> 
		&nbsp;
		<a href="./dbChatRoomList.jsp" > 채팅방 목록 	</a>
	</h3>
	<h3> DB 채팅 프로그램 </h3>
	<hr/>
	<c:if test= "${ chatRoomValid > 0 }" >
		<p> * [ 방 이 름 &nbsp; ] : ${ chatRoomDispName } </p>
		<p> * [ 개 설 자 &nbsp; ] : ${ chatRoomUserName } </p>
		<p> * [ 만든시각 &nbsp; ] : ${ chatRoomCreDate  } </p> 
	</c:if>
	<c:if test= "${ chatRoomValid == 0 }" >
		<p> * 삭제된 채팅방입니다. </p>
		<p> * &nbsp; </p> 
		<p> * &nbsp; </p> 
	</c:if>
	<c:if test= "${ chatRoomValid < 0 }" >
		<p> * 존재하지 않는 채팅방입니다. </p>
		<p> * &nbsp; </p> 
		<p> * &nbsp; </p> 
	</c:if>
	<hr/>
	<br/>
	<iframe name="chatView" src="dbChatView.jsp?chatRoomId=${ chatRoomId }#bottom" 
			width="500" height="300" scrolling="yes"
			frameborder="0" align="bottom"
			style="border:medium double black"
			${ chatDisabled }
	>
	</iframe> 
	<br/>
	<hr/>
	<form target="chatView" method="get" action="dbChatView.jsp#bottom" onSubmit="return checkSendMsg();" ${ chatDisabled }> 
		<ul style="padding-left:20px;">
			<li>
				<label for="userName">아이디</label> 
				<input type="text" id="userName" name="userName" size="10" value="" />
			</li>
			<li>
				<label for="msgText">메시지</label>
				<input type="text" 	 id="msgText" name="msgText" size="40" value="" />
				<input type="hidden" name="chatRoomId" value = "${ chatRoomId }"/>  
				<input type="submit" value="전송" /> <br/><br/>
			</li> 
			<li>				
				<button onclick="window.location.href='./dbChatRoomList.jsp'; return false;" >방 나가기</button>
			</li>
		</ul> 
	</form>
</body>
</html>